<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<title>video audio</title>
	<script type="text/javascript" src="../../lufylegend-1.8.12.min.js"></script>
</head>
<body>
	<div id="legend"></div>
<script>
init(30,"legend",480,480,main);
var backLayer;
var video;
var nowTime;
function main(){
	LGlobal.setDebug(true);
	video = new LVideo();
	video.addEventListener(LEvent.COMPLETE,gameInit);
	//video.load("sample1.mp4");
	var url = "http://lufylegend.com/media/LVideo/sample1.";
	video.load(url+"mp4,"+url+"3gp,"+url+"mov,"+url+"3g2,"+url+"ogv,"+url+"webm");
}
function gameInit(e){
	backLayer = new LSprite();
	addChild(backLayer);
	video.x=20;
	video.y=100;
	var layer = new LSprite();
	layer.addChild(video);
	backLayer.addChild(layer);
	
	nowTime = new LTextField();
	nowTime.x = 100;
	nowTime.y = 50;
	backLayer.addChild(nowTime);
	nowTime.text = "00:00:00";
	backLayer.addEventListener(LEvent.ENTER_FRAME,onframe);
	backLayer.addEventListener(LMouseEvent.MOUSE_UP,onup);
}	
function onup(e){
	if(e.offsetX > 30 && e.offsetX < 60 && e.offsetY > 0 && e.offsetY < 30){
		if(video.playing){
			video.stop();
		}else{
			video.play();
		}
	}else if(e.offsetX > 200 && e.offsetX < 350 && e.offsetY > 50 && e.offsetY < 90){
		video.setVolume((e.offsetX - 200)/150);
	}
}
function onframe(){
	backLayer.graphics.clear();
	backLayer.graphics.drawRect(2,"#000000",[20,0,440,100]);
	backLayer.graphics.drawRect(1,"#000000",[70,10,380,30]);
	
	var sec = video.data.currentTime % 60 >>>0;
	if(sec < 10)sec="0"+sec;
	var min = (video.data.currentTime / 60)>>>0;
	if(min < 10)min="0"+min;
	nowTime.text = "00:"+min+":"+sec;
	backLayer.graphics.drawRect(1,"#000000",[70,10,380*(video.data.currentTime/video.length)>>>0,30],true,"#000000");
	if(video.playing){
		backLayer.graphics.drawRect(2,"#000000",[30,10,10,30],true,"#000000");
		backLayer.graphics.drawRect(2,"#000000",[45,10,10,30],true,"#000000");
	}else{
		backLayer.graphics.drawVertices(1,"#000000",[[30,10],[60,25],[30,40]],true,"#000000");
	}
	for(var i=0;i<10;i++){
		var sx = 200 + i*15;
		var sy = 40 - i*4;
		if(video.getVolume() > i*0.1){
			backLayer.graphics.drawRect(1,"#000000",[sx,50,10,40-sy],true,"#000000");
		}else{
			backLayer.graphics.drawRect(1,"#000000",[sx,50,10,40-sy]);
		}
	}
}
</script>
	</body>
</html>